<script setup lang="ts">
import { onMounted } from 'vue';
import { Layout, Typography } from 'ant-design-vue';
import ChatPanel from '@/components/chat/ChatPanel.vue';
import { useChatStore } from '../store/chatStore';

const { Title } = Typography;
const { Header, Content } = Layout;

const chatStore = useChatStore();

onMounted(() => {
//   // 初始化聊天状态
//   chatStore.init();
});
</script>

<template>
  <Layout class="chat-layout">
    <Header class="chat-header">
      <Title :level="3" style="color: #fff; margin: 0;">AI知识库助手</Title>
    </Header>
    <Content class="chat-content">
      <div class="chat-container">
        <ChatPanel />
      </div>
    </Content>
  </Layout>
</template>

<style scoped>
.chat-layout {
  height: 100vh;
}

.chat-header {
  display: flex;
  align-items: center;
  padding: 0 24px;
  background: #1890ff;
}

.chat-content {
  padding: 24px;
  background: #f0f2f5;
}

.chat-container {
  height: 100%;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  overflow: hidden;
}
</style> 